import React from 'react';
import {Modal,Button} from 'antd';
import {WeaSelect,WeaLocaleProvider} from 'ecCom';
import {inject, observer} from 'mobx-react';
import DealRepetition from './DealRepetition';

const getLabel = WeaLocaleProvider.getLabel;

@inject ('wfDealRepetitionStore')

@observer

export default class Main extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            value : '1'
        }
    }

    DealRepetition = () =>  {
        const {wfDealRepetitionStore,overlapIds} = this.props;
        wfDealRepetitionStore.setVisible(true,overlapIds);
    }

    setValue = (v) => {this.setState({value: v})}

    onSure = () =>{
      this.setState({value:1}); 
      this.props.handleOk(this.state.value);
    };

    onCancel = () => {
      this.setState({value:1}); 
      this.props.handleCancel();
    }
    render () {
        const options = [
            {
                key: '1',
                selected: true,
                showname: getLabel(82669,"从新保存的代理设置中去除重复设置内容")
            },{
                key: '2',
                selected: false,
                showname: getLabel(82670,"以新保存的代理设置替换已有重复的代理设置")
            }
        ];
        const {visible,repetitionValue,method} = this.props;
        const footer = [
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@lr5f47@sure`} key="submit" type="primary" onClick={this.onSure}>
                {getLabel(83446,'确定')}
            </Button>,
            <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ytvpmt@cancel`} key="back" type="ghost" onClick={this.onCancel}>
              {getLabel(31129,'取消')}
            </Button>
        ];

        return (
            <div>

                <DealRepetition ecId={`${this && this.props && this.props.ecId || ''}_DealRepetition@n2q3ud`}/>

                <Modal ecId={`${this && this.props && this.props.ecId || ''}_Modal@9xy496`}
                    className="wf-agent-overlap"
                    title={getLabel(15172,'系统提示')}
                    visible={visible}
                    onCancel={this.props.handleCancel}
                    footer={footer}
                    maskClosable={false}
                >

                    {
                        (method === "add" || method === "editCondition" || method === "editBatch") &&
                        <div>
                            <div style={{height:'30'}}>

                                <i style={{display:'inline-block',fontSize:30,color:'#2db7f5',verticalAlign:'middle',marginRight:'10px'}} className="icon-coms-help"/>

                                <span style={{display: 'inline-block', verticalAlign: 'middle', marginLeft: '5', width:'410px'}}>
                                    {getLabel(82666,'当前代理设置与已有')} <a className="repetitionA" onClick={this.DealRepetition}>{repetitionValue}</a> {getLabel(383526,'条代理设置重复请选择重复数据处理方式')}
                                </span>

                            </div>
                            <div style={{paddingLeft: '39px'}}>
                                <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@p2eig3`}
                                    options={options}
                                    value={this.state.value}
                                    detailtype={3}
                                    viewAttr={3}
                                    fieldshowtypes={2}
                                    onChange={this.setValue}
                                />
                            </div>

                        </div>
                    }
                    {
                        method === "edit" &&
                        <div>
                            <p style={{fontSize:15,padding:"10px 0"}}>
                                {getLabel(82666,'当前代理设置与已有')} {repetitionValue} {getLabel(82667,'条代理设置重复')} <br/>
                                {getLabel(383539,'确认以新保存的代理设置替换已有重复的代理设置？')}
                            </p>
                        </div>
                    }
                </Modal>
            </div>
        )
    }
}